.progress {
    position: relative;
}
.container {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    border-radius: 50%;
    overflow: hidden;
}
.endLine {
    display: flex;
    align-items: center;
    width: 100%;
}
.endLine .render {
    margin-left: 12px;
}
.endLine .line {
    flex: 1;
}
.endLine .line > div {
    transition: width .6s;
}
.rightLine .line {
    transition: width .6s;
    text-align: right;
}
.rightLine .line .render {
    padding: 0 6px;
    display: inline-block;
    text-align: left;
    height: 100%;
}
.centerLine {
    position: relative;
}
.centerLine .line > div {
    transition: width .6s;
}
.centerLine .render {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    line-height: 1;
}
.lineContent {
    background-size: 16px 16px;
}
@keyframes panoramic{
    to {
        background-position: 200% 0;
    }
}